﻿
@{
    Layout = null;
}

<div>
    <div class="col-3 pr-0" style="display: none">
        <label id="Reagent-Component-ComponentId">@ViewData["ComponentId"]</label>
        <label id="Reagent-Component-Parent-ModalID">@ViewData["ModalID"]</label>
    </div>
    <div class="input-group">
        <div class="col-12 pr-0 pl-0">
            <span class="input-group-text font-rfs-modal border-radius-noright">试剂配制方法：</span>
        </div>
    </div>
    <div class="input-group">
        <div class="col-12 pr-0 pl-0" style="height:40vh;">
            <textarea id="Reagent-Component-AR" class="form-control font-rfs border-radius-noleft" style="height:100%;"></textarea>
        </div>
    </div>
</div>
<div class="text-right" style="padding-top: 5px;">
    <button id="Reagent-Component-resetting" type="button" class="btn btn-danger font-rfs-modal">重置</button>
    <button id="Reagent-Component-confirm" type="button" class="btn btn-primary font-rfs-modal">确定</button>
    <button id="Reagent-Component-cancel" type="button" class="btn btn-info font-rfs-modal">取消</button>
</div>
<div class="modal" id="Reagent-Component-DeleteMethod" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class='modal-header'>
                <p class="pt-3 pl-3 font-rfs">清除方法</p>
                <a data-dismiss="modal" class="modal-close">&times;</a>
            </div>
            <div class="modal-body">
                <p class="font-rfs">清除方法是不可恢复的操作，确认吗？</p>
            </div>
            <div class="modal-Delete-footer">
                <button id="Component-modal-delete" class="btn btn-outline-primary border-radius-noradius noLeftBorder noRightBorder font-rfs" style="width:50%; height:fit-content">确定</button>
                <button id="Component-modal-cancel" class="btn btn-outline-primary border-radius-noradius noRightBorder font-rfs" style="width:50%; height:fit-content">取消</button>
            </div>
        </div>
    </div>
</div>

<script>

    $(document).ready(function () {
        LoadMethod()
    });

    function LoadMethod() {
        $.post("getComponentMethod", {
            ComponentId: $("#Reagent-Component-ComponentId").html()
        }, function (data) {
            $("#Reagent-Component-AR").val(data);
        });
    }

    $("#Reagent-Component-cancel").click(function (event) {
        var modalID = $("#Reagent-Component-Parent-ModalID").html();
        $("#" + modalID).modal('hide');
    });

    $("#Reagent-Component-confirm").click(function () {
        if ($.trim($("#Reagent-Component-AR").val()).length == 0) {
            $("#Reagent-Component-cancel").click();
            return;
        } 

        $.post("UpdateComponentMethod", {
            ComponentId: $("#Reagent-Component-ComponentId").html(),
            method: document.getElementById('Reagent-Component-AR').value
        }, function (data) {
            alert(data);
            $("#Reagent-Component-cancel").click();
        });
    });

    $("#Reagent-Component-resetting").click(function () {
        $("#Reagent-Component-DeleteMethod").modal({
            backdrop: 'static',
            keyboard: false
        });
    });

    $("#Component-modal-delete").click(function () {
        $.post("UpdateComponentMethod", {
            ComponentId: $("#Reagent-Component-ComponentId").html()
        }, function (data) {
            $("#Reagent-Component-DeleteMethod").modal('hide');
            $("#Reagent-Component-cancel").click();
        });
    });

    $("#Component-modal-cancel").click(function () {
        $("#Reagent-Component-DeleteMethod").modal('hide');
    });

</script>
